<script lang="ts" setup>
// 行为
// lang="ts"  支持 ts 语法
// setup 是 Vue3 的组合式 API 语法
console.log('根组件');
const msg = 'Hi World';
const nickName:string = '苗子怡'
const age = 22
</script>


<template>
  <!-- template 类似鸿蒙组件的 build() 函数 用于构建页面-->
  <h1 class="title">{{ msg }}</h1>
  <p>{{ msg }}</p>
  <p>{{ nickName.charAt(0) }}</p>
  <p>{{ age >= 18 ? '已成年' : '未成年' }}</p>
  <input type="text" value="{{ msg }}">
  
</template>


<style scoped>
/* scoped 样式 只对当前组件生效 */  
.title {
  color: red;
}

</style>